<template>
	<u-popup :value="value" :mode="mode"  :width="width" :height="height" :closeable="closeable"
		:border-radius="borderRadius" :mask-close-able="maskCloseAble" :zoom="zoom" :duration="duration"
		:close-icon-size="closeIconSize" :safe-area-inset-bottom="safeAreaInsetBottom" :mask="mask" @close="closeHandler" @open="openHandler">
		<view class="title" style="">
			添加客户
		</view>
		<view class="u-card" style="height:79%;margin: 40rpx 20rpx 0 20rpx;">
			<view class="" style="display: flex;justify-content: space-between;margin-bottom: 20rpx;">
				<view class="">
					<i class="iconfont icon-shangcheng icon" style="margin-right:10rpx"></i> 
					<text style="font-size: 30rpx;font-family: PingFang SC;font-weight: bold;color: #333333;">{{listData.Title}}</text>
				</view>
				<u-tag :text="listData.Phone?listData.Phone:'15531048810'" type="primary" />
			</view>
			<u-line class="u-line" color="#409EFF"></u-line>
			<view class="" style="margin-top: 20rpx;">
				{{listData.Address}}
			</view>
			
			
		</view>
	</u-popup>
</template>

<script>
	export default {
		props: {
			value: {
				type: Boolean,
				default: false,
			},
			customStyle: {
				type: Object
			},
			// 宽度
			width: {
				type: String,
				default: "85%"
			},
			// 高度
			height: {
				type: String,
				default: "600rpx"
			},
			// 圆角
			borderRadius: {
				type: Number,
				default: 10
			},
			// 是否显示关闭图标
			closeable: {
				type: Boolean,
				default: true
			},
			// 是否可以点击遮罩层关闭
			maskCloseAble: {
				type: Boolean,
				default: true
			},
			// 遮罩打开或收起的动画过渡时间，单位ms
			duration: {
				type: String || Number,
				default: ""
			},
			// 关闭图标的大小
			closeIconSize: {
				type: String || Number,
				default: "40"
			},
			// 是否开启底部安全区适配
			safeAreaInsetBottom: {
				type: Boolean,
				default: true
			},
			// 是否开启缩放动画，只在mode为center时有效
			zoom: {
				type: Boolean,
				default: true
			},
			// 弹出方向
			mode: {
				type: String,
				default: "center"
			},
			// 是否显示遮罩
			mask: {
				type: Boolean,
				default: true
			},
			listData:{
				type:Object,
			}
		},
		data() {
			return {
				title: '素胚勾勒出青花，笔锋浓转淡',
				subTitle: '2020-05-15',
				thumb: '',
			}
		},
		methods: {
			inputHandler(val) {
				this.$emit('input', val)
			},
			confirmHandler(item = null) {
				this.$emit('confirm', item)
				this.inputHandler(false)
			},
			// 弹出层收起
			closeHandler() {
				this.$emit('closeHandler')
			},
			openHandler(){
				this.$emit('openHandler')
			}
			
		},
	}
</script>
<style lang="less" scoped>
	.title{
		text-align: center;
		font-size: 32rpx;
		font-weight: bold;
		padding-top:20rpx;
	}
	// 覆盖uview 卡片的边距样式
	::v-deep .u-card[data-v-80bc29b2]{
		margin: 0 !important;
	}
</style>